<template>
	<view>
		<u-navbar :background="background" :borderBottom="false">
			<view class="ft_16 fw-b">
				门店中心
			</view>
		</u-navbar>
		<view class="content">
			<view class="con_1 display">
				<image :src="userinfo.avatar"></image>
				<view class="c-fff p_left_10">
					<view class="p_bottom_10">
						<text class="p_right_10 ft_16">{{userinfo.username}}</text>
						<text class="ft_10 grade">LV{{userinfo.level}}</text>
					</view>
					<view class="ft_12 tjMan">
						推荐人：{{userinfo.p_username?userinfo.p_username:'无'}}
					</view>
				</view>
			</view>
			<view class="con_2">
				<view class="income display just_space">
					<view class="">
						<view class="ft_20">{{income.total_money}}</view>
						<view class="ft_12">我的收入（元）</view>
					</view>
					<view class="fenge"></view>
					<view class="">
						<view class="ft_20">{{income.distribution_money}}</view>
						<view class="ft_12">分销收入（元）</view>
					</view>
					<view class="fenge"></view>
					<view class="">
						<view class="ft_20">{{income.reward_money}}</view>
						<view class="ft_12">奖励收入（元）</view>
					</view>
				</view>
				<view class="TXincome display just_space">
					<view class="">
						<view class="ft_20">{{income.with_price}}</view>
						<view class="ft_12">可提现收入（元）</view>
					</view>
					<view class="ft_12 tixian" @click="go_tixian">
						佣金提现
					</view>
				</view>
			</view>
			<view class="con_3">
				<view class="display just_space other" v-for="(item,index) in others" :key="index" @click="goOther(index)">
					<view class="display">
						<image :src="item.icon"></image>
						<text class="p_left_10">{{item.title}}</text>
					</view>
					<u-icon name="arrow-right" color="#999999" size="28"></u-icon>
				</view>
			</view>
			
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				background:{backgroundColor: '#ffffff',},
				userinfo:{},
				income:{},
				others:[
					{
						icon:"../../../../static/mine/tuandui.png",
						title:"我的团队",
					},
					{
						icon:"../../../../static/mine/mingxi.png",
						title:"经销明细",
					},
					{
						icon:"../../../../static/mine/erweima.png",
						title:"我的二维码",
					},
					{
						icon:"../../../../static/mine/mendianshop.png",
						title:"商品专区",
					},
				],
				
			}
		},
		onLoad() {
			this.getInfo() //获取门店信息
		},
		methods: {
			getInfo(){ //获取门店信息
				this.$myRequest('user/income',{})
				.then(res=>{
					console.log(res.data);
					if(res.data.code==1){
						this.userinfo=res.data.data.user //用户信息
						this.income=res.data.data //收入
					}
				})
			},
			
			go_tixian(){ //去提现
				uni.navigateTo({
					url:"tixian"
				})
			},
			goOther(index){ //其他跳转
				switch (index){
					case 0: //我的团队
						uni.navigateTo({
							url:"myTeam"
						})
					break;
					case 1: //经销明细
						uni.navigateTo({
							url:"jingxiaoDetail"
						})
					break;
					case 2: //我的二维码
						uni.navigateTo({
							url:"myErweima"
						})
					break;
					case 3: //商品专区
						uni.navigateTo({
							url:"../../../../mendianshop"
						})
					break;
				}
			},
			
			
		}
	}
</script>

<style lang="scss">
page{
	background-color: #fafafa;
}
.content{
	.con_1{
		padding: 15px;background: linear-gradient(180deg, #F39230 0%, #E4331F 100%);
		margin-bottom: 5px;
		image{
			width: 60px;height: 60px;border-radius: 50%;
		}
		.grade{
			border: 1px solid #FFFFFF;border-radius: 30px;padding: 0 5px;
		}
		.tjMan{
			background-color: #ee7d51;padding: 2px 10px;border-radius: 30px;
		}
	}
	.con_2{
		padding: 0 15px;background-color: #FFFFFF;
		margin-bottom: 5px;
		.income{
			padding: 20px 0;
			border-bottom: 1px solid #eeeeee;
			.fenge{
				width: 1px;height: 24px;background-color: #eeeeee;
			}
		}
		.TXincome{
			padding: 20px 0;
			.tixian{
				color: #E67920;border: 1px solid #E67920;border-radius: 30px;padding: 5px 10px;
			}
		}
	}
	.con_3{
		padding: 0 15px;background-color: #FFFFFF;
		.other{
			padding: 15px 0;border-bottom: 1px solid #eeeeee;
			image{
				width: 20px;height: 20px;
			}
		}
	}
	
}

</style>
